<script setup lang="ts">
import { ref, reactive  } from 'vue'

 
import { GetMock } from '@/Api/user';
import datalist from '@/message/data'
import { onMounted } from 'vue';

const arr: any = ref(datalist)
const arr1 = ref(datalist)
const loading = ref(false)
const finished = ref(false)
const refreshing = ref(false)
const List: any = ref()
onMounted(() => {
  // Axios.get( /'/list').then((res) => {
  //   console.log(res)
  //   arr.value = res.data.list
  //   arr1.value = res.data.list
  // })
  // GetMock().then((res: any) => {
  //   console.log(res,'=======================Res===============');
  //   arr.value = res.data.list
  //   arr1.value = res.data.list
  // })

})


var onLoad = () => {
  setTimeout(() => {
    if (refreshing.value) {
      GetMock();
      refreshing.value = false;
    }
   
    // GetMock('up')
    loading.value = false;

    if (arr.value.length >= 60) {
      finished.value = true;
    }
  }, 1000);
}
var onRefresh = () => {
  // 清空列表数据
  finished.value = false;

  // 重新加载数据
  // 将 loading 设置为 true，表示处于加载状态
  loading.value = true;
  onLoad();
}
</script>

<template>
  <div>
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
        <van-swipe :autoplay="1000">
          <van-swipe-item v-for="(items, indexs) in arr1" :key="indexs">
            <van-card v-for="(item, index) in arr" :key="index" :num="item.num" :tag="item.city" :price="item.price"
              :desc="item.desc" title="商品标题" :thumb="item.img">
            </van-card>
            <img :src="items.img" alt="" />
          </van-swipe-item>
        </van-swipe>
      </van-list>
    </van-pull-refresh>

  </div>
</template>

<style lang="scss" scoped></style>
